<template>
	<view>
		<!-- 出库协议管理 -->
		<view class="bg-white p-4 flex flex-column">
			<view class="flex justify-between" style="width: 2000rpx;">
				<view class="flex align-center">
					<text>日期:</text>
					<view class="ml-2" style="width: 500rpx;">
						<uni-datetime-picker v-model="datetimerange" type="datetimerange" rangeSeparator="至" />
					</view>
				</view>
			</view>
			<view class="flex mt-2">
				<view class="mr-2 flex align-center px-2" style="border: 4rpx solid #eee;width: 1200rpx;">
					<input class="w-100" type="text" placeholder="请输入订单编号/合同编号/客户名称 进行搜索">
				</view>
				<view class="text-white bg-orange px-6 py-1">
					<text>搜索</text>
				</view>
			</view>
		    <!-- 表格 -->
		    <view class="mt-2 flex flex-column">
		    	<view class="w-100 flex font-md font-weight-bold"
		    		style="background-color: rgb(245,245,245);height: 80rpx;">
		    		<view class="text-center" style="width: 20%;line-height: 80rpx;">
		    			<text>商品信息</text>
		    		</view>
		    		<view class="text-center" style="width: 20%;line-height: 80rpx;">
		    			<text>价格</text>
		    		</view>
		    		<view class=" text-center" style="width: 20%;line-height: 80rpx;">
		    			<text>时间</text>
		    		</view>
		    		<view class=" text-center" style="width: 20%;line-height: 80rpx;">
		    			<text>状态</text>
		    		</view>
		    		<view class=" text-center" style="width: 20%;line-height: 80rpx;">
		    			<text>交易操作</text>
		    		</view>
		    	</view>
		    	<view v-if="false" style="height: 200rpx;" class="w-100 flex justify-center align-center">
		    		暂无数据
		    	</view>
		    	<view v-else class="flex font-sm" style="height: 150rpx;border-bottom:2rpx solid rgb(221,221,211);"
		    		v-for="(item,index) in 4" :key="index">
		    		<view class="flex align-center justify-center " style="width: 20%;line-height: 70rpx;">
		    			<view class="flex justify-center w-100">
		    				<text class="text-ellipsis">这是一条标的信息</text>
		    			</view>
		    		</view>
		    		<view class="flex align-center justify-center" style="width: 20%;line-height: 70rpx;">
		    			<view class="flex justify-center">
		    				<text>￥1999</text>
		    			</view>
		    		</view>
		    		<view class="flex align-center justify-center" style="width:20%;line-height: 70rpx;">
		    			<view class="flex justify-center">
		    				<text>这是一条投标消息</text>
		    			</view>
		    		</view>
		    		<view class="flex align-center justify-center" style="width: 20%;line-height: 70rpx;">
		    			<text>中标</text>
		    		</view>
		    		<view class="flex align-center justify-center" style="width: 20%;line-height: 70rpx;">
		    			<button class="font-sm bg-success text-white flex justify-center align-center"
		    				style="white-space: nowrap; width: 100rpx;height: 100rpx;">查看</button>
		    			<button class="font-sm bg-danger text-white flex justify-center align-center"
		    				style="white-space: nowrap;width: 100rpx;height: 100rpx;">删除</button>
		    		</view>
		    	</view>
		    </view>
		</view>
	</view>
</template>

<script>
	export default {
		name:"OutboundServiceAgreement",
		data() {
			return {
				datetimerange:[],
				range:[],
				Selectvalue:'',
			};
		}
	}
</script>

<style lang="scss">

</style>